import {arrayToObject} from '../../../../assets/js/util.js'
export default{
  data() {
    return{
      /*当前页显示数量*/
      pageSize:10,
      /*每页显示的数量*/
      pageSizes:[10, 20, 50, 100],
      /*dataTotal表数量*/
      dataTotal:0,
      /*分页器*/
      currentPage: 1,
      loading: false,
    	// 默认参数 和 URL
      SRC: '',
      DP: {
        p: '',
        f: ''
      },
      title:'充值排行流水',
      xlsxTitle:'',
      // 存放获取到的类型数
      types: [],
			// 存放获取到的区服数
			serviceAreas: [],
			// 提交的表单
		  form: {
		  	type: '',
		  	serviceArea: '0',
		  },
		  // 表单验证
		  rules: {
        serviceArea: [
          { required: true, message: '请选择区服', trigger: 'change' }
        ],
        type: [
          { required: true, message: '请选择类型', trigger: 'change' }
        ]
      },
			// 所有el-form-item label的宽度
		  formLabelWidth: '120px',
    	/*表格数据*/
    	tableData:[],
      /*表格数据全部*/
      tableDataAll:[],
    	/*realTimeServiceContent 的宽*/
    	realTimeServiceContent:'100%',
    	/*表的宽度*/
    	realTimeServiceTableWidth: "100%",
    	/*数据表头*/
    	tableHeader:[
        {prop:'innerId',label:'充值排名'},
        {prop:'plat',label:'充值区服'},
        {prop:'channel',label:'充值账号ID'},
        {prop:'serviceArea',label:"累计充值金额("+localStorage.getItem("ZULONGBICURRENCY")+")"},
        {prop:'accountId',label:'消耗排名'},
        {prop:'roleId',label:'消耗货币类型'},
        {prop:'roleGrade',label:'累计消耗'}
    	]
    }
  },
	computed:{
		// xlsx(){
		// 	return this.title+'.xlsx'
		// }
	},
  methods: {
  	// 通用 成功 与 失败
    successFun(data) {
      this.$message({
        message: data,
        type: 'success'
      });
    },
    errorFun(data) {
      this.$message.error(data);
    },
    // 分页器
    // 控制每页的数量
    handleSizeChange(val) {
      this.pageSize = val;
      this.tableControl();
    },
    // 页数
    handleCurrentChange(val) {
      this.currentPage = val;
      this.tableControl();
    },
    tableControl() {
       this.tableData = this.tableDataAll.slice((this.currentPage-1)*this.pageSize,this.currentPage*this.pageSize)
    },
  	// 提交数据
  	commitData() {
  		var that = this;
  		var p = new Promise(function(resolve,reject){
  			 var obj = {
            "type": that.form.type,
  			 		"serverid":that.form.serviceArea
  			 }
         that.dataTotal = 0;
         that.loading = true;
         that.tableData = [];
         that.tableDataAll = [];
         obj = encodeURI(JSON.stringify(obj));
  			 that.$http.jsonp(`${that.SRC}data/get.do?p=${that.DP.p}&f=${that.DP.f}&a=search`,{
            params:{'ps':'params='+obj},
          }).then(function(res){
  			 		resolve(res.body)
  			 	}
  			 )
  		})
  		p.then(function(value){
        that.loading = false;
  			var data = JSON.parse(JSON.parse(value));
  			if(parseInt(data["res"]) === 0){
          that.dataTotal = data.data.length;
          if(data.data.length === 0){
            that.errorFun("暂无数据！")
          }else{
            that.tableDataAll = arrayToObject(that.tableHeader,data.data);
            that.tableControl();
          }
  			}else{
  				that.errorFun(data["msg"])
  			}
  		})
  	},
  	// 搜索
		search(form){
			this.$refs[form].validate((valid) => {
        if (valid) {
         	this.commitData()
        } else {
          this.errorFun('请完善输入的值！');
          return false;
        }
      });
		},
		//重置
    reset(form) {
      this.$refs[form].resetFields();
    },
  	/*获取区服列表数据*/
  	getData: function(){
  		var that = this;
      // 将数据push到选择框中
      var pushData = function(pushArr,attr,data) {
        for (var i in data[attr]) {
          that[pushArr].push({
            label: i,
            value: data[attr][i]
          })
        }
      };
  		var p = new Promise(function(resolve,reject){
  			that.$http.jsonp(`${that.SRC}data/get.do?p=${that.DP.p}&f=${that.DP.f}&a=initParam`,{
        params:{'ps': '' }
        }).then(function(res){
  				resolve(res.body)
  			})
  		})
  		p.then(function(value){
  			var data = JSON.parse(JSON.parse(value));
  			if(parseInt(data["res"]) === 0){
          pushData("types","typeItmes",data);
          pushData("serviceAreas","serverItmes",data);
  			}else{
  				that.getErrorMsg(Number(data.res))
  			}
  		})
  	},
  	/*设置初始值*/
  	_init(){
  		window.addEventListener('resize', function() {
  			/*修改表格的宽度*/
        		this.realTimeServiceTableWidth = document.body.clientWidth-240+"px";
        		this.realTimeServiceContent = document.body.clientWidth-220+"px";
      	}.bind(this))
  	},
  	// 表格下载
  	excel(val) {
      this.xlsxTitle = val;
			this.downloadExl(this.tableHeader,this.tableDataAll,this.xlsxTitle,this.title);
  		
  	}
  },
  mounted() {
   	this._init()
   	// 初始化URL
    this.SRC = this.$store.getters.src;
    this.DP.p = localStorage.getItem('ZULONGBIPROJECTID');
    this.DP.f = localStorage.getItem('ZULONGBIPAGEID');
   	this.getData()
   	// this.getData(this.pageSize,this.currentPage)
  }
}